<template>
	<view>
		<view class="mask" :style=" {display:flag ? 'none':'block'} ">
			<view class="qdk">
				<view>快递申请</view>
				<view>获取你的基本信息</view>
				<view>
					<button @click="jj">拒绝</button>
					<button @click="yx">允许</button>
				</view>
			</view>
		</view>
		<view>
			<view class="ss">
				<input type="text" placeholder="请输入搜索内容" @click="input">
				<view @click="ss">扫一扫</view>
			</view>
		</view>
		<view class="kjk">
			<view class="kjkl">
				<view>寄快递</view>
				<view>同城最快一小时</view>
			</view>
			<view class="kjkr">
				<view>大件行李</view>
				<view>每公斤最低一元</view>
			</view>
		</view>
		<view class="bgxx">
			<view class="xx" @click="bgxqone">
				<view><view>张圆圆</view><view>长沙市</view></view>
				<view>{{pjz}}--></view>
				<view><view>李小明</view><view>北京市</view></view>
			</view>
		</view>
		<view class="bgxx">
			<view class="xx" @click="bgxqtwo">
				<view><view>张三</view><view>长沙市</view></view>
				<view>{{ywc}}--></view>
				<view><view>李小明</view><view>北京市</view></view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				flag: false, //改成false
				pjz:"派送中",
				ywc:"已完成"
			};
		},
		methods: {
			bgxqone(){
				console.log("包裹详情")
				uni.navigateTo({
					url:`/pages/BGXQ/BGXQ?zt=${this.pjz}`
				})
			},
			bgxqtwo(){
				uni.navigateTo({
					url:`/pages/BGXQ/BGXQ?zt=${this.ywc}`
				})
			},
			jj() {
				this.flag = true
			},
			yx() {
				this.flag = true
			},
			input(){
				uni.navigateTo({
					url:"/pages/Search/Search"
				})
			},
			ss(){
				uni.navigateTo({
					url:"/pages/SS/SS"
				})
			}
		}
	}
</script>

<style lang="scss">
	.xx{
		width: 100vw;
		display: flex;
		// justify-content: space-around;
		justify-content: space-around
	}
	.bgxx{
		width: 100vw;
		height: 20vh;
		// background: red;
		display: flex;
		align-items: center;
		justify-content: space-around;
	}
	.kjkr{
		width: 50vw;
		height: 10vh;
	}
	.kjkl{
		width: 50vw;
		height: 10vh;
	}
	.kjk{
		width: 100vw;
		height: 15vh;
	 
		display: flex;
	}
	 
	.ss input{
		border: 1px solid #ccc;
		flex-grow: 1;
	}
	.ss {
		width: 100vw;
		height: 10vh;
		display: flex;
		align-items: center;
	}

	.mask {
		width: 100vw;
		height: 100vh;
		background: rgba(0, 0, 0, .3);
		position: fixed;
		z-index: 9999;
	}

	.qdk {
		width: 100vw;
		height: 30vh;
		background: #fff;
		position: fixed;
		bottom: 0;
	}
</style>